---
layout: example.html
title: UTFGrid
shortdesc: This example shows how to read data from a UTFGrid source.
docs: >
  <p>Point to a country to see its name and flag.</p>
  Tiles made with <a href="https://tilemill-project.github.io/tilemill/">TileMill</a>. Hosting on <a href="https://www.mapbox.com/">mapbox.com</a> or with open-source <a href="https://github.com/maptiler/tileserver-php">TileServer</a>.
tags: "utfgrid, tilejson"
cloak:
  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
---
<div id="map" class="map"></div>
<div style="display: none;">
  <!-- Overlay with the country info -->
  <div id="country-info">
    <div id="country-name">&nbsp;</div>
    <img id="country-flag" />
  </div>
</div>
